﻿@model string
@{
    Layout = null;
}

<!DOCTYPE html>

<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <title>修改密码</title>
    <link href="~/common/Threelinkage/layui/css/layui.css" rel="stylesheet" />
    <style>
        .head {
            height: 50px;
            line-height: 50px;
            text-align: center;
            color: white;
            background-color: rgb(70,180,230);
        }

        .gray {
            color: gray;
        }
    </style>

</head>
<body>
    <div class="layui-row head">
        <div class="layui-col-lg1">
            <a href="/Login/GetBackPwd2">
                <i class="layui-icon-left layui-icon"></i>
            </a>
        </div>
        <div class="layui-col-lg6 layui-col-lg-offset2">
            <h2><span class="gray">找回密码&nbsp;&nbsp;>>&nbsp;&nbsp;填写验证码&nbsp;&nbsp;>>&nbsp;&nbsp;</span>修改密码</h2>
        </div>
    </div>
    <br />
    <br />
    <br />

    <div class="layui-row">
        <div class="layui-col-lg4 layui-col-lg-offset4">
            <form class="layui-form" id="form1">
                <div class="layui-form-item">
                    <label class="layui-form-label">邮箱：</label>
                    <div class="layui-input-block">
                        <input type="email" name="Email" lay-verify="required|email" value="@Model" autocomplete="off" class="layui-input layui-disabled">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">新密码：</label>
                    <div class="layui-input-block">
                        <input type="password" id="PassWord" name="PassWord" lay-verify="required|pass" value="" autocomplete="off" class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">确认密码：</label>
                    <div class="layui-input-block">
                        <input type="password" name="newPassWord" lay-verify="required|okPwd" value="" autocomplete="off" class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <button class="layui-btn layui-btn-fluid layui-btn-radius" lay-submit lay-filter="formDemo">
                        确认修改
                    </button>
                </div>
            </form>
        </div>
    </div>


    <script src="~/common/Threelinkage/layui/layui.js"></script>
    <script type="text/javascript">


        layui.use(['jquery', 'layer', 'form'], function (args) {
            var $ = layui.jquery, layer = layui.layer, form = layui.form;

            form.verify({
                okPwd: function (value, item) { //value：表单的值、item：表单的DOM对象
                    if ($('#PassWord').val()!=value) {
                        return '两次输入的密码不一致';
                    }
                },
                pass: [
                    /^[\S]{6,16}$/
                    , '密码必须6到12位，且不能出现空格'
                ]
            });

            //重新发送验证码表单提交
            form.on('submit(formDemo)', function () {
                var load = layer.load(1, {
                    shade: [0.1, '#fff'] //0.1透明度的白色背景
                });
                var json = $('#form1').serialize();
                $.ajax({
                    url: '/Login/GetBackPwd3', data: json,
                    dataType: "json",
                    type: 'post',
                    success: function (res) {
                        if (res.status == "ok") {
                            location.href = '/Login/GetBackPwd4';
                        } else if (res.status == "redirect") {
                            layer.msg(res.errorMsg, { icon: 2, time: 1000 });
                            setTimeout(function () {
                                location.href = res.data;
                            }, 1000);
                        } else if (res.status == "error") {
                            layer.msg(res.errorMsg, { icon: 2, time: 1000 });
                        } else {
                            layer.msg("错误", { icon: 2, time: 1000 });
                        }
                        layer.close(load);
                    },
                    error: function () {
                        layer.msg("网络错误", { icon: 2, time: 1000 });
                        layer.close(load);
                    }
                });
                return false;
            });

        });

    </script>
</body>
</html>
